
<template>
    用户名:<input type="text" placeholder="请填写需要查询的用户名" v-model="Membername"/>
    状态:<select v-model="Memberstate">
                <option :value="0">请选择</option>
                <option :value="1">启用</option>
                <option :value="2">禁用</option>
            </select>
            <input type="button" value="查询" @click="showinfo()"/>
   <table border="1">
    <thead>
        <tr>
            <td>用户名</td>
            <td>密码</td>
            <td>邮箱</td>
            <td>状态</td>
            <td>真实姓名</td>
            <td>用户类型</td>
            <td>操作</td>
        </tr>
    </thead>
    <tbody>
        <tr v-for="item in info">
            <td>{{ item.name }}</td>
            <td>{{ item.password }}</td>
            <td>{{ item.email }}</td>
            <td>{{ item.state==true?"启用":"禁用"}}</td>
            <td>{{ item.userName }}</td>
            <td>{{ item.typename }}</td>
            <td>操作</td>
        </tr>
    </tbody>
   </table>
</template>
<script setup lang="ts">
import { onMounted,ref } from 'vue';
import axios from 'axios';
onMounted(()=>{
    showinfo();
})

const Membername=ref("");
const Memberstate=ref(0);

const info=ref([{
    "name": "",
    "userName": "",
    "email": "",
    "state": true,
    "password": "",
    "typename": ""
}])


const showinfo=()=>{
    axios.get("https://localhost:7231/api/User/ShowMemberInfo",
        {
            params:{
                name:Membername.value,
                state:Memberstate.value
            }
            

        }
    )
    .then(res=>{
        console.log(res.data);
        info.value=res.data;
    })
}

</script>